<template>
  <f7-page>
    <f7-navbar title="超级用户">
      <f7-link slot="nav-right" @click=" $refs.actionsOneGroup.open()">
        <f7-icon material="add"></f7-icon>
      </f7-link>
    </f7-navbar>
    <f7-actions ref="actionsOneGroup">
      <f7-actions-group>
        <f7-actions-button @click="add" bold color="bule">添加用户</f7-actions-button>
        <f7-actions-button @click="jiudianxuzhi" bold color="bule">须知管理</f7-actions-button>
        <f7-actions-button @click="tuichudenglu" bold color="bule">退出登录</f7-actions-button>
      </f7-actions-group>
      <f7-actions-group>
        <f7-actions-button color="red">取消</f7-actions-button>
      </f7-actions-group>
    </f7-actions>
    <f7-list v-for="(user, index) in object" :key="index">
      <f7-list-item swipeout :title="user.realname" :after="user.contact">
        <f7-swipeout-actions right>
          <f7-swipeout-button delete @click="delete1(user.id)">Delete</f7-swipeout-button>
        </f7-swipeout-actions>
      </f7-list-item>
    </f7-list>
  </f7-page>
</template>
<script>
import axios from "axios";
export default {
  data() {
    return {
      object: [],
      id: null
    };
  },
  mounted() {
    this.selectUser();
  },
  methods: {
    selectUser() {
      const self = this;
      const app = self.$f7;
      URL = "/caofuying/user/selectUser";
      axios.get(URL, {}).then(r => {
        const { data } = r;
        if (data != null) {
          this.object = data;
        } else {
          app.dialog.alert("服务器错误");
        }
      });
    },

    tuichudenglu() {
      const self = this;
      const app = self.$f7;
      //app.dialog.alert(`确定退出？`, () => {
      this.$f7router.navigate("/");
      //});
    },
    add() {
      this.$f7router.navigate("/supertubeadd/");
    },
    jiudianxuzhi() {
      this.$f7router.navigate("/hotel/");
    },
    delete1(id) {
      const self = this;
      const app = self.$f7;
      URL = `/caofuying/user/delectUser/${id}`;
      axios.delete(URL).then(r => {
        const { data } = r;
        if (data == 1) {
          app.dialog.alert("删除成功");
        } else if (data == 0) {
          app.dialog.alert("删除失败");
        } else {
          app.dialog.alert("服务器错误");
        }
      });
    }
  }
};
</script>
<style>
.actions-button-text {
  text-align: center !important;
  font-size: larger !important;
}
</style>
